import React from 'react';

import { Layout } from 'antd';
const { Content } = Layout;
import HeaderView from './header';
import SiderView from './sider';
import Login from './login/index.tsx';
import NoFoundPage from './404.tsx';
const BasicLayout = props => {
  if (props.location.pathname === '/login') {
    return <Login></Login>
  } else if (props.location.pathname === '/404') {
    return <NoFoundPage></NoFoundPage>
  }

  return (
    <Layout style={{ height: '100vh' }}>
      <SiderView></SiderView>

      <Layout className="site-layout">
        <HeaderView props={props}></HeaderView>
        <Content
          className="site-layout-background"
          style={{
            margin: '10px 0px',
            padding: 12,
            minHeight: 280,
          }}
        >
          {/* 约定式嵌套路由 */}
          {props.children}
        </Content>
      </Layout>
    </Layout>
  );
};

export default BasicLayout;
